import React,{Suspense} from 'react'
import routes from './routerConfig'
import {BrowserRouter,Routes,Route,Navigate} from 'react-router-dom'
function RouterView() {

  const renderRoute=(arr)=>{
      return arr.map((item,index)=>{
          return item.path ? <Route key={index} path={item.path} element={<item.element ></item.element>}>\
            {
                item.children && renderRoute(item.children)
            }
          </Route>:
          <Route key={index} path={item.from} element={<Navigate to={item.to}></Navigate>}></Route>
      })
  }  

  return (
    <Suspense fallback="路由加载中">
        <BrowserRouter>
            <Routes>
                {
                    renderRoute(routes)
                }
            </Routes>
        </BrowserRouter>
    </Suspense>
  )
}

export default RouterView